<template>
    <div class="home_container">
      <el-header>
        <div class="home_title">实验室管理平台</div>
        <div class="home_userinfoContainer">
          <router-link to="/login"> 登录 </router-link>
        </div>
      </el-header>
      <el-table :data="tableData" style="width: 100%">
        <el-table-column prop="date" label="日期" width="150"></el-table-column>
        <el-table-column label="配送信息">
          <el-table-column prop="name" label="姓名" width="120"></el-table-column>
          <el-table-column prop="province" label="省份" width="120"></el-table-column>
          <el-table-column prop="city" label="市区" width="120"></el-table-column>
          <el-table-column prop="address" label="地址" width="300"></el-table-column>
          <el-table-column prop="zip" label="邮编" width="120"></el-table-column>
        </el-table-column>
      </el-table>
    </div>
  </template>
  
  <script>
  export default {
    data() {
      return {
        tableData: [{
          date: '2016-05-03',
          name: '王小虎',
          province: '上海',
          city: '普陀区',
          address: '上海市普陀区金沙江路 1518 弄',
          zip: 200333
        }, {
          date: '2016-05-02',
          name: '王小虎',
          province: '上海',
          city: '普陀区',
          address: '上海市普陀区金沙江路 1518 弄',
          zip: 200333
        }, {
          date: '2016-05-04',
          name: '王小虎',
          province: '上海',
          city: '普陀区',
          address: '上海市普陀区金沙江路 1518 弄',
          zip: 200333
        }, {
          date: '2016-05-01',
          name: '王小虎',
          province: '上海',
          city: '普陀区',
          address: '上海市普陀区金沙江路 1518 弄',
          zip: 200333
        }, {
          date: '2016-05-08',
          name: '王小虎',
          province: '上海',
          city: '普陀区',
          address: '上海市普陀区金沙江路 1518 弄',
          zip: 200333
        }, {
          date: '2016-05-06',
          name: '王小虎',
          province: '上海',
          city: '普陀区',
          address: '上海市普陀区金沙江路 1518 弄',
          zip: 200333
        }, {
          date: '2016-05-07',
          name: '王小虎',
          province: '上海',
          city: '普陀区',
          address: '上海市普陀区金沙江路 1518 弄',
          zip: 200333
        }]
      }
    }
  }
  </script>
  
  <style>
    .home_container {
      position: absolute;
      top: 0px;
      left: 0px;
      width: 100%;
    }
  
    .el-header {
      background-color: #20a0ff;
      color: #333;
      text-align: center;
      display: flex;
      align-items: center;
      justify-content: space-between;
    }
  
    .el-aside {
      background-color: #ECECEC;
    }
  
    .el-main {
      background-color: #fff;
      color: #000;
      text-align: center;
    }
  
    .home_title {
      color: #fff;
      font-size: 22px;
      display: inline;
      vertical-align: middle; /* 垂直居中对齐 */
    }
  
    .home_userinfoContainer {
      display: inline;
      margin-right: 20px;
      vertical-align: middle; /* 垂直居中对齐 */
    }
  </style>
  